// import { isAsyncThunkAction } from '@reduxjs/toolkit'
import styles from "./Posts.module.css";
import {
  //   Post,
  //   useAddPostMutation,
  useGetPostsQuery,
} from "../../app/services/posts";

export const PostList = () => {
  const { data: posts, isLoading } = useGetPostsQuery();

  if (isLoading) {
    return <div>Loading</div>;
  }

  if (!posts) {
    return <div>No posts :(</div>;
  }

  const listItems = posts.map((post, idx) => <li key={idx}>{post.name}</li>);
  return (
    <div className={styles.container}>
      <h2>显示所有 post</h2>
      <ul >{listItems}</ul>
    </div>
  );
};
